import React, { useEffect, Suspense } from 'react'
import { Redirect, Route, Switch, withRouter } from 'react-router-dom'
import { Layout } from 'antd'
import routes from '@/router'
import Source from './pages/source'

const { Content } = Layout

// const getPageTitle = () => {
//   const title = 'react-tool-admin'
//   return title
// }

const menus = []

function getRouters(menu) {
  menu.forEach((item) => {
    if (item.component) {
      menus.push(item)
    } else {
      getRouters(item.children)
    }
  })
}
getRouters(routes)

const AppContent = (props) => {
  const loading = () => <div className="loader"></div>

  useEffect(() => {
    // document.title = getPageTitle()
  }, [])
  
  return (
    <Content className="app-content">
      <Suspense fallback={loading()}>
        <Switch>
          <Redirect exact from="/" to="/dashboard" />
          {menus.map((route) => {
            return (
              route.component && (
                <Route
                  key={route.path}
                  path={route.path}
                  name={route.name}
                  render={(props) => <route.component {...props} />}
                />
              )
            )
          })}
          <Redirect to="/error/404" />
        </Switch>
      </Suspense>
      <Source />
    </Content>
  )
}

export default withRouter(AppContent)
